<template>
	<view>
		<view class="tops bgw ">
			<view class="status_bar bgw"> </view>
			<view @tap="go('../mapSet/mapSet?state=0')" class="location p30">
				<image class="icon1 vm" src="../../static/image/icon_location@2x.png" mode=""></image>
				<p class="one">{{addressText}}</p>
				<image class="icon2 vm" src="../../static/image/icon_xia@2x.png" mode=""></image>
			</view>
			<search />
		</view>
		<view class="contens  bgw">
			<view v-if="productLists != '' " class="p30">
				<view class="bestSell p30">
					<view class="top"> 
						<image class="vm" src="../../static/image/bestSell.png" mode=""></image>
						热卖排行榜
						<span>
							| 大家都在买
						</span>
					</view>
					<view class="goodscontent">
						<view @tap="go('../GoodsDetails/GoodsDetails?id='+v.id)" v-for="(v,i) in productLists" :key="i" class="goods">
							<image :src="v.thumbnail" mode="aspectFill"></image>
							<p class="two">
								{{v.name}}
							</p>
							<view class="bottom">
								<p class="money one">
									￥{{v.price}}
								</p>
								销量 {{v.sales}}
								<image class="fr" src="../../static/image/jiaAddProduct.png" mode=""></image>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<view class="nav  bgw">
				<view class="p30">
					<view class="icons p30">
						<view>
							<image src="../../static/image/songhuo.png" mode=""></image>
							可送货可自取
						</view>
						<view>
							<image src="../../static/image/quanqiu.png" mode=""></image>
							全球产地直供
						</view>
						<view>
							<image src="../../static/image/xinxian.png" mode=""></image>
							新鲜有保障
						</view>
					</view>
				</view>
				
				<view class="navs">
					<view @tap="go('../shopSort/shopSort?id='+v.id)" v-for="(v,i) in nav" :key="i">
						<image :src="v.icon" mode=""></image>
						<p class="one">
							{{v.name}}
						</p>
					</view>
				</view>
			</view>
		</view>
		<!-- 轮播 -->
		<view v-if="advertList != '' " class="banner">
			<swiper class="screen-swiper square-dot" :indicator-dots="true" :circular="true" :autoplay="true" interval="3000"
			 duration="500"> 
				<swiper-item @tap="openAdver(v)" v-if="v.path" v-for="(v,i) in advertList" :key="i" style="z-index: 0;">
					<image :src="v.path" mode="aspectFill"></image>
				</swiper-item>
			</swiper>
		</view>
		<view class="main p30">
			<view class="shopTitle">
				推荐店铺 <span>为您优选</span>
			</view>
			<view class="shopList">
				<view @tap="go('../shopDetails/shopDetails?id='+v.id)" v-for="(v,i) in StoreLists" :key="i" class="shopDetail">
					<image class="shopLogo" :src="v.headImg" mode="aspectFill"></image>
					<view class="shopText">
						<p class="one title">
							{{v.name}}
						</p>
						<p class="state">
							<view class="fraction">
								<image src="../../static/image/star.png" mode=""></image>
								5.0
							</view> 
							<view class="distance">
								{{v.distanceStr}}
							</view> 
						</p>
						<p class="label">
							<span>
								{{v.category.name}}
							</span>
						</p>
						<p v-if="v.validActivity !=null" class="bottom one">
							<span>活动</span>
							<view v-for="(j,k) in v.validActivity.activityItems" :key="k"> 
								满{{j.exceedPrice}}减{{j.deductionPrice}} 
							</view>  
						</p>
					</view> 
				</view> 
			</view> 
		</view> 
		<newlyBuild ref="newlyBuild"> </newlyBuild>
		<noLocation ref="noLocation"></noLocation>
	</view>
</template>

<script>
	import search from '../../components/search/search.vue'
	import noLocation from '../../components/noLocation/noLocation.vue'
	import {
		storeCategory,storeList,productList,adList,my
	} from '../../api/api.js'
	import {
		mapState,
		mapActions
	} from "vuex";
	import {checkingLogin} from '@/tool/index.js'
	export default {
		computed: {
			...mapState(['longitude', 'latitude'])
		},
		components: {
			search,
			noLocation
		},
		data() {
			return {
				advertList:[],
				addressText: '定位中',
				nav: [],
				StoreLists: [],   
				storeStop: false,
				storeLabel:{
					pageNumber:1,
					pageSize:10
				},
				productLists:[], 
			};
		},
		onPullDownRefresh() {
			 this.goodsList()
			 this.storeStop =false
			 this.storeLabel.pageNumber = 1
			 this.StoreLists = []
			 this.storeListsInit()
		},
		onLoad() { 
			uni.onTabBarMidButtonTap(() => {
				this.$refs['newlyBuild'].show()
			})
			this.getLocation() 
		},
		mounted() {
			let MarketGo = uni.getStorageSync('MarketGo')
			if (MarketGo) {
				setTimeout(() => {
					if (MarketGo.type == 'goods') {
						this.$navigateTo('../GoodsDetails/GoodsDetails?id=' + MarketGo.id)
					}
					if (MarketGo.type == 'dynamic') {
						this.$navigateTo('../DynamicDetails/DynamicDetails?id=' + MarketGo.id)
					}
					if (MarketGo.type == 'market') {
						this.$navigateTo('../ji/ji?id=' + MarketGo.id)
					}
					uni.removeStorageSync('MarketGo')
				}, 1400)
			} 
			if(checkingLogin()){
				this.getYpMyData()
			}
		},
		onShow() {
			let locationsLtLg = uni.getStorageSync('locationsLtLg')
			let locationsTxt = uni.getStorageSync('locationsTxt')
			if (locationsTxt != '') {
				this.addressText = locationsTxt
				this.goodsList()
				this.storeStop = false
				this.storeLabel.pageNumber = 1
				this.StoreLists = []
				this.storeListsInit()
			}
		},
		onReachBottom() {
			 if(!this.storeStop){
				 this.storeListsInit()
			 }
		},
		methods: {
			async getYpMyData(){
				let user = await my();
				if(user.code==0){ 
					uni.setStorageSync('epUserData',user.user)
					uni.setStorageSync('rongToken',user.rongToken)
					if(user.cpsUserId){  
						uni.setStorageSync('cpsUserId',user.cpsUserId)  
					} 
				} 
			},
			openAdver(v){
				if(v.isExternalLink){
					plus.runtime.openURL(v.url)
				}else{
					this.go('../webView/webView?url='+v.url)
				} 
			},
			getLocation() {
				uni.getLocation({
					type: 'wgs84',
					success: (res) => { 
						this.$store.commit("setlongitude", res.longitude);
						this.$store.commit("setlatitude", res.latitude);
						this.navs()
						this.storeListsInit()
						this.goodsList()
					},
					fail: (err) => {
						this.$refs['noLocation'].show()
					}
				});
				let that = this
				let parameret = {
					latitude: this.$store.state.latitude,
					longitude: this.$store.state.longitude
				}
				plus.maps.Map.reverseGeocode(parameret, {}, function(event) {
					console.log(event);
					that.addressText = event.address
				}) 
			}, 
			go(url){
				this.$navigateTo(url)
			},
			async navs(){
				this.advertList  = await adList({
					id:20
				})
				this.advertList = this.advertList.data
				let nav = await storeCategory()
				this.nav = nav.data.content
				uni.setStorageSync('IndexSort', nav.data.content)
			},
			async storeListsInit (){
				let StoreLists = await storeList({
					longitude:this.$store.state.longitude,
					latitude:this.$store.state.latitude,
					pageable:this.storeLabel
				}) 
				 StoreLists = StoreLists.data
				if(StoreLists.length != this.storeLabel.pageSize){
					this.storeStop = true
				} 
				this.StoreLists = [...this.StoreLists,...StoreLists]
				this.storeLabel.pageNumber++
				uni.stopPullDownRefresh()
			},
			async goodsList(){
				let productLists = await productList({
					longitude:this.$store.state.longitude,
					latitude:this.$store.state.latitude,
					pageable:{ pageNumber:1, pageSize:20 }
				})
				this.productLists = productLists.data
			} 
		}
	};
</script>
<style lang="less" scoped>
	@import './index.less';
</style>
